import React, { Component, PureComponent } from "react";

const nameContext = React.createContext();
const { Provider, Consumer } = nameContext
class A extends Component {
    state = {
        name : '陶贼帅'
    }
    render() {
        return (
            <div>
                <h1>this is A component 传递数据：{this.state.name}</h1>
                <Provider value={ this.state }>
                    <B></B>
                </Provider>
                
            </div>
        );
    }
}

class B extends Component {
    render() {
        return (
            <div>
                <h2>this is B component</h2>
                <C></C>
            </div>
        );
    }
}

// class C extends Component {
//     static contextType = nameContext


//     render() {
//         return (
//             <div>
//                 <h3>this is C component  接收到祖组件传来的数据：{ this.context.name }</h3>
//             </div>
//         );
//     }
// }

function C(){

    return (
        <div>
            <h3>this is C component  接收到祖组件传来的数据：</h3>
            <Consumer>
                {
                    value =>{
                        return (
                            <span>{ value.name }</span>
                        )
                    }
                }
            </Consumer>
        </div>
    );
}

export default A;
